import "./index.scss"

import React, { Component } from 'react'
import {connect} from "react-redux"
import { Carousel , Image} from 'antd';
@connect(
    state=>{
        return {
            banner:state.getIn(['data','banner'])
        }
    }
)
class HomeIndex extends Component {
    onChange=()=>{

    }
    render() {
        const {banner} = this.props
        console.log(this.props);
        return (
            <div>
                <h2 style={{paddingBottom:'10px'}}>欢迎光临</h2>
                <Carousel autoplay afterChange={this.onChange}>
                    {
                        banner.map((item,i)=>{
                            return(
                                <div key={i} style={{position:'relative',width:'100%',height:320}}>
                                    <img  preview={false} src={item.toJS().imgUrl} height={320}  style={{width:'100%',height:320}} />
                                </div>
                            )
                        })
                    }
                </Carousel>
            </div>
        )
    }
}
export default HomeIndex